import React from "react";
import ReactDom from "react-dom";
import { makeAutoObservable } from "mobx";
import { observer } from "mobx-react-lite";

class Timer {
  secondPassed = 0;

  constructor() {
    makeAutoObservable(this);
  }
  increaseTime() {
    this.secondPassed += 1;
  }
}

const myTimer = new Timer();

const TimerView = observer((timer) => {
  const [timer] = useState(() => new Timer());
  return <span>Seconds Passed:{timer.secondPassed}</span>;
});

ReactDom.render(<TimerView />, document.body);

setInterval(() => {
  myTimer.increaseTime();
}, 1000);

const { author, setAuthor } = message.author;
autorun(() => {
  console.log(author.name);
});
runInAction(() => {
  author.name = "change1";
});
runInAction(() => {
  setAuthor({ name: "name2" }); // 这个不会被更新
  author.name = "change2";
});
